<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>主页</title>
    <link rel="icon" type="images/x-icon" href="img/icons/favicon.ico">
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/font/css/font-awesome.min.css">
    <link rel="stylesheet" href="css/userPageNew.css">
    <link rel="stylesheet" href="css/selfItroduction.css">
    <link rel="stylesheet" href="css/player.css">
    <link rel="stylesheet" href="css/logReg.css" />
    <link rel="stylesheet" href="css/dialog.css">
    <link rel="stylesheet" href="css/moreAlbum.css">
    <link rel="stylesheet" href="css/uploadWork.css">
    <link rel="stylesheet" href="css/buildNewAlbum.css">
    <link rel="stylesheet" href="css/followNew.css">

    <!--darkTheme-->
    <!--<link rel="stylesheet" href="css/skin/skin002.css">-->

    <!--换肤 -> 自定义背景模板-->
    <style>
        .SY-content {
            background-image:url(https://wx3.sinaimg.cn/large/b4479d23gy1fua8830qlfj21gs0rs7bu.jpg);
            background-repeat:repeat;
            background-attachment:fixed;
            background-position:center top;
        }
        .SY-mainBox {
            background-image:url(https://wx3.sinaimg.cn/large/b4479d23gy1fua8830qlfj21gs0rs7bu.jpg);
            background-repeat:repeat;
            background-attachment:fixed;
            background-position:center top;
        }
    </style>

</head>
<body>
<!--头部 开始-->
<div class="SY-header pf">
    <div class="clearfix">
        <div class="SY-logo fl usn">
            <a href="UserCenter.html"><img src="img/icons/logo.png" alt="深夜学院"><span class="slogin">深夜研习社</span></a>
        </div>
        <div class="SY-search pa dib">
            <div class="inputField">
                <input type="text" class="SY-input tac" placeholder="请输入作者名" onfocus="this.placeholder=''" onblur="this.placeholder='请输入作者名'">
                <a href="javascript:void(0);" class="search-icon pa"><i class="fa fa-search"></i></a>
            </div>
            <div class="searchTips pa dn">
                <div class="searchReferral dn">
                    <div class="searchRecent">
                        <p class="title">最近搜索</p>
                        <ul class="clearfix">
                            <li class="worker dib fl"><a href="javascript:void(0);"><span>大石头</span>CG</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">Eric Zhang</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                        </ul>
                    </div>
                    <div class="searchHot">
                        <p class="title">热门搜索</p>
                        <ul class="clearfix">
                            <li class="worker dib fl"><a href="javascript:void(0);">大石头CG</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">Eric Zhang</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                        </ul>
                    </div>
                </div>
                <div class="searchResult">
                    <ul class="d n">
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>123</a></li>
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>designer</a></li>
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>icon</a></li>
                        <li class="worker title">创作者</li>
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>CG</a></li>
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>老师</a></li>
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>老板</a></li>
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>boss</a></li>
                    </ul>
                    <div class="checkMore tac d n">
                        <a href="javascript:void(0);">查看全部搜索结果<i class="fa fa-angle-double-right"></i></a>
                    </div>
                    <!--缺省提示-->
                    <div class="emptyInfo tac dn">
                        <p class="tips">暂未找到您想要查找的作,去<a href="MoreWorker.html">分类</a>查找更多作者吧!</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="SY-topRight fr">
            <ul class="clearfix">
                <li class="SY-create fr">
                    <a href="Post.html"><span>创作</span></a>
                </li>
                <li class="SY-userPic fr">
                    <a href="UserCenter.html">
                        <img class="br50" src="img/icons/person.png" alt="userPic">
                        <object><a href="javascript:void(0);"><span class="mark db pa approveBlue"></span></a></object>
                    </a>
                    <div class="pa tac fold">
                        <span class="pa trigon"></span>
                        <ul>
                            <li class="myPage"><a href="UserPageNew.html">我的研习社</a></li>
                            <li class="myPage"><a href="http://www.shenyecg.com" target="_blank">深夜学院</a></li>
                            <li class="authentication"><a href="CareerAuthen.html">深夜认证</a></li>
                            <li class="wallet"><a href="MyWallet.html">钱包</a></li>
                            <li class="setting"><a href="UserSetting.html">设置</a></li>
                            <li class="SY-exit">
                                <a href="javascript:void(0);"><i></i>退出</a>
                            </li>
                        </ul>
                    </div>
                </li>
                <li class="SY-regLog fr dn">
                    <a href="javascript:void(0);">注册</a>
                    <a href="javascript:void(0);">登录</a>
                </li>
                <li class="SY-notify fr">
                    <a href="Notify.html"><i></i><span class="num pa">99+</span></a>
                    <div class="pa fold">
                        <span class="pa trigon"></span>
                        <p class="topBox clearfix">
                            <span class="text fl">消息盒子</span>
                            <a href="javascript:void(0);" class="emptyBtn fr">清空</a>
                        </p>
                        <ul class="">
                            <li><a href="javascript:void(0);">[系统]管理员审核通过了你发表的原创作品《路人甲》</a></li>
                            <li><a href="javascript:void(0);">[私信]路人甲给你发来了1条私信</a></li>
                            <li><a href="javascript:void(0);">[通知]路人甲关注了你</a></li>
                        </ul>
                        <!--缺省提示-->
                        <div class="emptyInfo tac dn">
                            <p class="tips">暂无消息</p>
                        </div>
                        <div class="checkAll">
                            <a class="db tac" href="Notify.html">查看全部&nbsp;>></a>
                        </div>
                    </div>
                </li>
                <li class="fr line"></li>
                <li class="SY-focus fr">
                    <a href="UserCenter.html"><i></i><span>关注</span></a>
                </li>
                <li class="SY-Recruit fr">
                    <a href="Recruit.html"><i></i><span>招聘</span></a>
                    <span class="event db pa new"></span>
                </li>
                <li class="SY-piazza fr">
                    <a href="SquareNew.html"><i></i><span>广场</span></a>
                </li>
                <li class="SY-CG fr dn">
                    <a href="http://www.shenyecg.com" target="_blank"><i></i><span>学院</span></a>
                </li>
                <li class="SY-index fr dn">
                    <a href="Index.html"><i></i><span>首页</span></a>
                </li>
            </ul>
        </div>
    </div>
</div>
<!--头部 结束-->
<!--主内容 开始-->
<div class="SY-content">
    <div class="SY-mainContent">
        <!--个人主页封面-->
        <div class="SY-userBannerBox pr" style="background-image:url('http://img.yxs.shenyecg.com/Image/sjeoJe8XzPKxDqtxfsoK2Z3MLqpmrPpI/37JNxRbBbD.jpg')">
            <!--换肤按钮-->
            <div class="renewStyle pf">
                <a class="db btn" href="javascript:void(0);"></a>
            </div>
            <div class="cover pa"></div>
            <div class="SY-userInfo tac pr">
                <div class="SY-notice pa">
                    <a href="javascript:void(0);" class="icon db br50 pa"><i></i></a>
                    <div class="SY-announcement pa">
                        <span class="line db pa"></span>
                        <!--已有公告-->
                        <div class="announcement">
                            <div class="topBox clearfix">
                                <h2 class="title fl">公告</h2>
                                <p class="time fr">2018-05-17</p>
                            </div>
                            <p class="text">下个月18日晚上6点我会开启我的首次直播，同学们记得来捧场</p>
                            <div class="btns tar">
                                <a class="edit" href="javascript:void(0);">编辑</a>
                            </div>
                        </div>
                        <!--暂无公告-->
                        <div class="emptyInfo dn">
                            <h2 class="title tal">公告</h2>
                            <p class="tips tal">暂无公告哦~</p>
                            <a href="javascript:void(0);">添加</a>
                        </div>
                        <!--编辑公告-->
                        <div class="editAnnounce dn">
                            <h2 class="title tal">公告</h2>
                            <div class="editBox pr">
                                <textarea placeholder="暂无公告内容" onfocus="this.placeholder=''" onblur="this.placeholder='暂无公告内容'"></textarea>
                                <span class="wordsLimit warning pa"><i>0</i>/40</span>
                            </div>
                            <div class="btns tar">
                                <a class="save" href="javascript:void(0);">保存</a>
                                <a class="cancel" href="javascript:void(0);">取消</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="SY-user pa">
                    <div class="avatar br50 pr">
                        <img class="br50" src="http://img.yxs.shenyecg.com/Image/h8VE1fiHlWerj0FrkEUSYlLa4m3sppLi/KECAnarYPG.jpg" alt="">
                        <a href="javascript:void(0);"><span class="mark pa db approveGold"></span></a>
                    </div>
                    <h2 class="nickName">这是用户的昵称<span class="editIcon dib"></span></h2>
                    <p class="careerMsg dn">
                        <span class="compName">两点十分</span><i>|</i><span class="position">产品开发</span><i>|</i><span class="trueName">你的名字</span>
                    </p>
                    <p class="desc">这是此用户的内容主题描述</p>
                    <div class="datas">
                        <p class="scan dib"><span class="num">1002</span>浏览</p>
                        <p class="played dib"><span class="num">1002</span>播放</p>
                        <p class="liked dib"><span class="num">4056</span>喜欢</p>
                        <span class="line"></span>
                        <a href="FollowNew.html" class="subscript dib"><span class="num">115</span>订阅</a>
                        <a href="FollowNew.html" class="followed dib"><span class="num">455</span>关注</a>
                    </div>
                    <div class="btns">
                        <a class="followBtn dib transition" href="javascript:void(0)">关注</a>
                        <a class="sendMsgBtn dib transition" href="javascript:void(0)">私信</a>
                    </div>
                </div>
            </div>
        </div>
        <!--导航-->
        <div class="SY-navTab">
            <ul class="tac">
                <li class="item dib active"><a href="javascript:void(0);">主页</a></li>
                <li class="item dib"><a href="javascript:void(0);">动态</a></li>
                <li class="item dib"><a href="javascript:void(0);">收藏</a></li>
                <li class="item dib"><a href="javascript:void(0);">留言板</a></li>
            </ul>
        </div>
        <!--主内容-->
        <div class="SY-mainBox">
            <!--主页-->
            <div class="SY-mainPage">
                <!--主页导航-->
                <div class="SY-subNav clearfix">
                    <div class="SY-pageNav fl">
                        <ul class="clearfix">
                            <li class="item fl active"><a href="javascript:void(0);">作品集</a></li>
                            <li class="item fl"><a href="javascript:void(0);">个人资料</a></li>
                            <li class="item fl"><a href="javascript:void(0);">订阅项目</a></li>
                            <li class="item fl"><a href="javascript:void(0);">创作历程</a></li>
                        </ul>
                    </div>
                    <div class="SY-pageMsg fr">
                        <div class="clearfix">
                            <a class="manageBtn transition fr" href="MoreAlbum.html">管理</a>
                            <a class="uploadBtn tac transition db fr" href="UploadWork.html"><i class="fa fa-plus"></i>上传作品</a>
                            <div class="livingTip fr">
                                <span class="icon dib"></span>
                                <a class="livingName dib toe" href="javascript:void(0);">正在直播：<span>《这是正在直播的课程名称》</span></a>
                            </div>
                        </div>
                    </div>
                </div>
                <!--主页主内容-->
                <div class="SY-mainPageBox">
                    <!--作品集-->
                    <div class="SY-workCollection">
                        <div class="workList">
                            <ul class="clearfix">
                                <li class="item sy-video pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/744/552/large/konstantinos-skenteridis-nomx-kingkostas2017.jpg?1531186456')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/760/842/large/konstantinos-skenteridis-fury-kingkostas2017.jpg?1531259334')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-video pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/744/900/large/konstantinos-skenteridis-darkjourney-kingkostas2017.jpg?1531188661')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/744/093/large/konstantinos-skenteridis-field-kingkostas2015.jpg?1531182823')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/724/163/large/konstantinos-skenteridis-canyonruins-kingkostas2018.jpg?1531081848')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/733/693/large/konstantinos-skenteridis-chap-799-livestream-lakev1.jpg?1531138546')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/007/682/632/large/bastien-grivet-guardian-bastien-grivet.jpg?1507821303')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/755/411/large/bastien-grivet-from-the-hill.jpg?1531241188')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-video pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/695/860/large/greg-rutkowski-remorseful-cleric-1500.jpg?1530903204')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-video pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/383/181/large/daniel-jimenez-villalba-the-night-king-detail.jpg?1529325769')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/000/403/306/large/daniel-jimenez-villalba-basilica.jpg?1421091479')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-video pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/771/387/large/bastien-grivet-the-door.jpg?1531320918')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/726/901/large/paperblue-net-lake-tree.jpg?1531096588')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-video pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/892/024/large/paperblue-net-ship-typhoon.jpg?1531955038')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/889/809/large/maena-paillet-snow04.jpg?1531945342')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/719/865/large/patrik-pulkkinen-blood-moon.jpg?1531065196')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/748/224/large/mina-lee-final-edit01-large-size.jpg?1531212103')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/719/274/large/borisut-chamnan-spirit-1.jpg?1531062725')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/009/537/563/smaller_square/yang-tian-pansen.jpg?1519569817')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/846/835/large/anthony-avon-sunny-island-small.jpg?1531747144')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-video pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/842/147/large/oleksiy-golovchenko-overpaint-04.jpg?1531720370')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/785/138/large/even-amundsen-sweptlands-2.jpg?1531390947')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-video pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/852/421/large/lee-b-maru-160814.jpg?1531765496')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/861/279/large/dani-torres-cisne-0-5x.jpg?1531810747')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-video pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/858/600/large/pop-amp-anne-80s-.jpg?1531795176')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/860/947/large/dani-torres-owl-lo.jpg?1531808872')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                                <li class="item sy-pic pr">
                                    <a href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/859/009/large/weijung-lee-18-0712-02.jpg?1531797837')">
                                        <div class="markIcon pa"><span></span></div>
                                    </a>
                                </li>
                            </ul>
                            <!--缺省-->
                            <div class="emptyInfo tac dn">
                                <div class="icon"></div>
                                <p class="tip">暂时没有作品集，赶快去新建一个作品集吧~<a href="BuildNewAlbum.html">立即新建</a></p>
                            </div>
                            <!--loading-->
                            <div class="loading tac dn">
                                <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                            </div>
                        </div>
                    </div>
                    <!--个人资料-->
                    <div class="SY-userFileBox dn">
                        <!--视频秀-->
                        <div class="SY-introduce">
                            <p class="title">视频秀</p>
                            <div class="selfIntroduction dn">
                                <div class="introductVideo">
                                    <div id="t-video" class="video usn " style="position:relative;width:100%;height:100%;left:0;top:0;box-sizing:border-box;">
                                        <video id="playVideo" style="display: block; width: 100%; height: 100%;box-sizing:inherit;" src="" poster="https://wx4.sinaimg.cn/crop.0.0.585.329.1000/006Tr4asly1fnyqrpm47og30ga095myx.gif" auto="" play=""></video>
                                        <div class="sewise-player-ui usn">
                                            <div class="controlbar transition">
                                                <div class="controlbar-bg">
                                                    控制栏背景
                                                </div>
                                                <div class="controlbar-btns">
                                                    <div class="controlbar-btn controlbar-div-play">
                                                        <a href="javascript:void(0);" class="controlbar-btns-play" tabindex="1">播放</a>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-pause">
                                                        <a href="javascript:void(0);" class="controlbar-btns-pause" tabindex="2">暂停</a>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-progress">
                                                        <div class="progressBox">
                                                            <div class="controlbar-progress-totalline br5"></div>
                                                            <div class="controlbar-progress-loadedline br5 transition" style="width: 60.391352%;"></div>
                                                            <div class="controlbar-progress-playedline br5 transition" style="width: 15.0466252%;">
                                                                <div class="controlbar-progress-playpoint transition br50"></div>
                                                            </div>
                                                            <div class="controlbar-progress-seekline"></div>
                                                            <div class="controlbar-progress-tip" current-time="" style="left: 20%;">
                                                                <span>30:00</span>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-time">
                                                        <div class="controlbar-playtime">
                                                            00:04
                                                        </div>
                                                        <div class="controlbar-playtime-split">
                                                            /
                                                        </div>
                                                        <div class="controlbar-totaltime">
                                                            155:11
                                                        </div>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-volume pr">
                                                        <div class="controlbar-div-volumeline pa">
                                                            <div class="controlbar-volumeline br5 pa">
                                                                <div class="controlbar-volumeline-bg br5">
                                                                </div>
                                                                <div class="controlbar-volumeline-volume transition br5 pa" style="height:48px;">
                                                                </div>
                                                                <div class="controlbar-volumeline-dragger">
                                                                </div>
                                                                <div class="controlbar-volumeline-point br50 pa">
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="controlbar-div-soundclose volume" style="display: none;">
                                                            <a href="javascript:void(0);" class="controlbar-btns-soundclose" tabindex="1"></a>
                                                        </div>
                                                        <div class="controlbar-div-soundopen volume" style="display: block;">
                                                            <a href="javascript:void(0);" class="controlbar-btns-soundopen" tabindex="1"></a>
                                                        </div>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-barrage">
                                                        <a href="javascript:void(0);" class="controlbar-btns-barrage close" tabindex="1"></a>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-palyRate pr">
                                                        <div class="controlbar-btns-menu br5" role="presentation">
                                                            <ul class="controlbar-btns-palyRate-content" role="menu">
                                                                <li class="controlbar-btns-palyRate-item" tabindex="-1" role="palyRateItem" aria-live="polite">4.0x<span class="vjs-control-text"></span></li>
                                                                <li class="controlbar-btns-palyRate-item" tabindex="-1" role="palyRateItem" aria-live="polite">3.0x<span class="vjs-control-text"></span></li>
                                                                <li class="controlbar-btns-palyRate-item" tabindex="-1" role="palyRateItem" aria-live="polite">2.0x<span class="vjs-control-text"></span></li>
                                                                <li class="controlbar-btns-palyRate-item" tabindex="-1" role="palyRateItem" aria-live="polite">1.75x<span class="vjs-control-text"></span></li>
                                                                <li class="controlbar-btns-palyRate-item" tabindex="-1" role="palyRateItem" aria-live="polite">1.5x<span class="vjs-control-text"></span></li>
                                                                <li class="controlbar-btns-palyRate-item" tabindex="-1" role="palyRateItem" aria-live="polite">1.25x<span class="vjs-control-text"></span></li>
                                                                <li class="controlbar-btns-palyRate-item active" tabindex="-1" role="palyRateItem" aria-live="polite">1.0x<span class="vjs-control-text"></span></li>
                                                            </ul>
                                                        </div>
                                                        <div class="controlbar-btns-palyRate br5">1.0x</div>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-resolution pr">
                                                        <div class="controlbar-btns-menu br5">
                                                            <ul class="controlbar-btns-resolution-content">
                                                                <li class="controlbar-btns-resolution-item">超清</li>
                                                                <li class="controlbar-btns-resolution-item active">高清</li>
                                                                <li class="controlbar-btns-resolution-item">普清</li>
                                                                <li class="controlbar-btns-resolution-item">自动</li>
                                                            </ul>
                                                        </div>
                                                        <div class="controlbar-btns-resolution br5">高清</div>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-fullscreen" style="display: block;">
                                                        <a href="javascript:void(0);" class="controlbar-btns-fullscreen" tabindex="1"></a>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-normalscreen" style="display: none;">
                                                        <a href="javascript:void(0);" class="controlbar-btns-normalscreen" tabindex="1"></a>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="progressbar transition6 pa">
                                                <div class="progress-inner transition pa" style="width: 50%"></div>
                                            </div>
                                            <div class="logo" style="display: none;">
                                                <a href="http://www.shenyecg.com/" target="_blank" class="logo-icon" tabindex="1" style="">logo</a>
                                            </div>
                                            <div class="topbar" style="display: none;">
                                                <div class="topbar-program">
                                                    <div class="topbar-program-tip">
                                                        正在播放：
                                                    </div>
                                                    <div class="topbar-program-title">
                                                    </div>
                                                </div>
                                                <div class="topbar-clock">
                                                    2018-1-30 14:19:57
                                                </div>
                                            </div>
                                            <div class="buffer" style="display: none;">
                                                <div class="buffer-bg">
                                                    背景图片
                                                </div>
                                                <div class="buffer-text">
                                                    <div class="buffer-text-tip">
                                                    </div>
                                                    <div class="buffer-text-bufferPt">
                                                        ...
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="big-play-btn br50">
                                                <a href="javascript:void(0);" class="big-play-icon pause" tabindex="1"><i class="fa fa-play"></i></a>
                                                <a href="javascript:void(0);" class="big-play-icon replay" tabindex="1"><i class="fa fa-rotate-left"></i></a>
                                            </div>
                                            <div class="clarity-switch-btn" style="top: 0; margin-top: -5px;display: none;">
                                                <a href="javascript:void(0);" class="clarity-btn-text" tabindex="1">自动</a>
                                            </div>
                                            <div class="danmaku state-pause" id="danmu">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="uploadVideo tac">
                                <a href="http://art.shenyecg.com/Setting/Index" target="_blank" class="uploadBtn dib pr">
                                    <span class="icon db"></span>
                                    <p>设置个人介绍视频或者您最喜欢的作品视频</p>
                                    <p>（格式为MP4）</p>
                                </a>
                            </div>
                        </div>
                        <!--深夜认证-->
                        <div class="SY-authentication">
                            <p class="title">深夜认证</p>
                            <p class="careerMsg">
                                <span class="compName">两点十分</span><span class="position">产品开发</span><span class="trueName">你的名字</span>
                            </p>
                        </div>
                        <!--基本信息-->
                        <div class="SY-baseMsg">
                            <p class="title clearfix">
                                <span class="fl">基本信息</span>
                                <a class="rewriteBtn transition db fr" href="http://art.shenyecg.com/Setting/Index" target="_blank">修改</a>
                            </p>
                            <div class="user-detail">
                                <p class="nickName">
                                    <span class="txt dib">用户名</span>
                                    <span class="text dib">你的名字叫什么</span>
                                </p>
                                <p class="theme">
                                    <span class="txt dib">主题内容</span>
                                    <span class="text dib">对自己定位的一句话</span>
                                </p>
                                <p class="homeTown">
                                    <span class="txt dib">家乡</span>
                                    <span class="text dib">湖北/武汉</span>
                                </p>
                                <p class="liveNow">
                                    <span class="txt dib">现居</span>
                                    <span class="text dib">湖北/武汉</span>
                                </p>
                                <p class="career">
                                    <span class="txt dib">职业</span>
                                    <span class="text dib">CG模型师</span>
                                </p>
                                <p class="siteYear">
                                    <span class="txt dib">深夜年龄</span>
                                    <span class="text dib">一岁零一个月</span>
                                </p>
                                <p class="desc">
                                    <span class="txt dib">简介</span>
                                    <span class="text dib">简介内容是什么</span>
                                </p>
                            </div>
                        </div>
                        <!--社交主页-->
                        <div class="SY-societyPage">
                            <p class="title clearfix">
                                <span class="fl">社交主页</span>
                                <a class="rewriteBtn transition db fr" href="http://art.shenyecg.com/Setting/Index" target="_blank">修改</a>
                            </p>
                            <div class="societyWays clearfix">
                                <a class="sina br50 db fl" href="javascript:void(0);"></a>
                                <a class="tencent br50 db fl" href="javascript:void(0);"></a>
                                <a class="artstation br50 db fl" href="javascript:void(0);"></a>
                                <a class="behance br50 db fl" href="javascript:void(0);"></a>
                                <a class="qzone br50 db fl" href="javascript:void(0);"></a>
                                <a class="wechat br50 db fl" href="javascript:void(0);"></a>
                            </div>
                        </div>
                        <!--个人标签-->
                        <div class="SY-userTag">
                            <p class="title clearfix">
                                <span class="fl">个人标签</span>
                                <a class="rewriteBtn transition db fr" href="http://art.shenyecg.com/Setting/Index" target="_blank">修改</a>
                            </p>
                            <p class="text">展示个人标签的内容是什么</p>
                        </div>
                        <!--loading-->
                        <div class="loading tac dn">
                            <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                        </div>
                    </div>
                    <!--订阅项目-->
                    <div class="SY-subscriptBox dn">
                        <div class="clearfix">
                            <div class="SY-target fl">
                                <div class="targetBox">
                                    <div class="changeBtn clearfix">
                                        <p class="title fl">阶段目标</p>
                                        <p class="btns br5 fr clearfix">
                                            <a href="javascript:void(0);" class="prev fl transition dib tac disable"><i class="fa fa-angle-left"></i></a>
                                            <a href="javascript:void(0);" class="next fl transition dib tac"><i class="fa fa-angle-right"></i></a>
                                        </p>
                                    </div>
                                    <div class="targetProgress pr clearfix">
                                        <div class="target pr fl">
                                            <p class="goalTxt">
                                                <span class="complete">已完成<em class="feb">89</em></span>
                                                <span class="uncomlplete">目标<em class="feb">300</em></span>
                                            </p>
                                            <div class="progress br5 pr">
                                                <p class="record br5 transition pa"></p>
                                            </div>
                                            <p class="text">
                                                关于这个目标的描述，达到目标后会做什么事情。关于这个目标的描述，达到目标后会做什么事情。关于这个目标的描述，达到目标后会做什么事情。
                                            </p>
                                        </div>
                                        <div class="target pr fl">
                                            <p class="goalTxt">
                                                <span class="complete">已完成<em class="feb">300</em></span>
                                                <span class="uncomlplete">目标<em class="feb">600</em></span>
                                            </p>
                                            <div class="progress br5 pr">
                                                <p class="record br5 pa"></p>
                                            </div>
                                            <p class="text">
                                                关于这个目标的描述，达到目标后会做什么事情。关于这个目标的描述，达到目标后会做什么事情。
                                            </p>
                                        </div>
                                        <div class="target pr fl">
                                            <p class="goalTxt">
                                                <span class="complete">已完成<em class="feb">600</em></span>
                                                <span class="uncomlplete">目标<em class="feb">1000</em></span>
                                            </p>
                                            <div class="progress br5 pr">
                                                <p class="record br5 pa"></p>
                                            </div>
                                            <p class="text">
                                                关于这个目标的描述，达到目标后会做什么事情。关于这个目标的描述，达到目标后会做什么事情。
                                            </p>
                                        </div>
                                        <div class="target pr fl">
                                            <p class="goalTxt">
                                                <span class="complete">已完成<em class="feb">1000</em></span>
                                                <span class="uncomlplete">目标<em class="feb">1500</em></span>
                                            </p>
                                            <div class="progress br5 pr">
                                                <p class="record br5 pa"></p>
                                            </div>
                                            <p class="text">
                                                关于这个目标的描述，达到目标后会做什么事情。关于这个目标的描述，达到目标后会做什么事情。
                                            </p>
                                        </div>
                                    </div>
                                </div>
                                <!--缺省-->
                                <div class="emptyInfo tac dn">
                                    <a class="db transition setTargetBtn" href="javascript:void(0);"><i class="fa fa-plus"></i>设置目标</a>
                                </div>
                                <!--loading-->
                                <div class="loading tac dn">
                                    <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                                </div>
                            </div>
                            <div class="SY-subsBox visi tor fr">
                                <ul class="clearfix">
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/719/865/large/patrik-pulkkinen-blood-moon.jpg?1531065196')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db transition" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority">永久</span>获得
                                            </a>
                                        </div>
                                    </li>
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/760/842/large/konstantinos-skenteridis-fury-kingkostas2017.jpg?1531259334')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db transition active" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority"></span>已获得
                                            </a>
                                        </div>
                                    </li>
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/744/093/large/konstantinos-skenteridis-field-kingkostas2015.jpg?1531182823')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db disable transition" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority">永久</span>获得
                                            </a>
                                        </div>
                                    </li>
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/733/693/large/konstantinos-skenteridis-chap-799-livestream-lakev1.jpg?1531138546')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db transition" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority">永久</span>获得
                                            </a>
                                        </div>
                                    </li>
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/695/860/large/greg-rutkowski-remorseful-cleric-1500.jpg?1530903204')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db transition" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority">永久</span>获得
                                            </a>
                                        </div>
                                    </li>
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/383/181/large/daniel-jimenez-villalba-the-night-king-detail.jpg?1529325769')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db transition" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority">永久</span>获得
                                            </a>
                                        </div>
                                    </li>
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/000/403/306/large/daniel-jimenez-villalba-basilica.jpg?1421091479')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db transition" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority">永久</span>获得
                                            </a>
                                        </div>
                                    </li>
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/889/809/large/maena-paillet-snow04.jpg?1531945342')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db disable transition" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority">永久</span>获得
                                            </a>
                                        </div>
                                    </li>
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/755/411/large/bastien-grivet-from-the-hill.jpg?1531241188')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db transition" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority">永久</span>获得
                                            </a>
                                        </div>
                                    </li>
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/861/279/large/dani-torres-cisne-0-5x.jpg?1531810747')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db transition" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority">永久</span>获得
                                            </a>
                                        </div>
                                    </li>
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/852/421/large/lee-b-maru-160814.jpg?1531765496')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db disable transition" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority">永久</span>获得
                                            </a>
                                        </div>
                                    </li>
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/860/947/large/dani-torres-owl-lo.jpg?1531808872')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db transition" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority">永久</span>获得
                                            </a>
                                        </div>
                                    </li>
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/858/606/large/pop-amp-anne-80s-.jpg?1531795575')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db transition" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority">永久</span>获得
                                            </a>
                                        </div>
                                    </li>
                                    <li class="item transition fl">
                                        <div class="itemPic" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/785/138/large/even-amundsen-sweptlands-2.jpg?1531390947')"></div>
                                        <div class="itemMsg">
                                            <h3 class="itemTitle toe">订阅内容标题</h3>
                                            <p class="itemText">
                                                对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈
                                            </p>
                                            <div class="itemDatas">
                                                <p class="populationLimit">人数限制：<span>1000</span></p>
                                                <p class="extraPopulation">还剩：<span>255</span></p>
                                                <p class="openTime">开放时间：<span>2018-07-27</span></p>
                                            </div>
                                            <p class="checkDetail clearfix">
                                                <a class="introDetailBtn fl" href="javascript:void(0);">>>介绍详情</a>
                                                <a class="checkDetailBtn fr" href="javascript:void(0);">>>查看详情</a>
                                            </p>
                                            <a class="buyBtn tac db transition" href="payCenter.html" target="_blank">
                                                <span class="price">￥99</span><span class="authority">永久</span>获得
                                            </a>
                                        </div>
                                    </li>
                                </ul>
                                <!--分页-->
                                <div class="page tac">
                                    <ul class="pageList pr clearfix">
                                        <li class="text disable"><a href="javascript:void(0);">首页</a></li>
                                        <li class="text disable"><a href="javascript:void(0);">上一页</a></li>
                                        <li class="pageActive"><a href="javascript:void(0);">1</a></li>
                                        <li><a href="javascript:void(0);">2</a></li>
                                        <li><a href="javascript:void(0);">3</a></li>
                                        <li><a href="javascript:void(0);">...</a></li>
                                        <li class="text"><a href="javascript:void(0);">下一页</a></li>
                                        <li class="text"><a href="javascript:void(0);">尾页</a></li>
                                    </ul>
                                </div>
                                <!--缺省-->
                                <div class="emptyInfo tac dn">
                                    <div class="icon"></div>
                                    <p class="tip">为支持者分享优质内容，说明支持者可获得的奖励，<br>同时获得一份额外的收入</p>
                                    <a class="transition db setRewardBtn" href="javascript:void(0)">设置奖励</a>
                                </div>
                                <!--loading-->
                                <div class="loading tac dn">
                                    <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                                </div>
                            </div>
                            <!--loading-->
                            <div class="loading tac dn">
                                <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                            </div>
                        </div>
                    </div>
                    <!--创作历程-->
                    <div class="SY-createWaysBox dn">
                        <div class="mainTimeLine">
                            <p class="text">时至今日，<span class="nickName">这个该作者的昵称</span>共创作了<span class="num">25</span>组创作</p>
                            <div class="createTimeLine">
                                <div class="timeLine timeNow pr">
                                    <div class="timeMark pa">至今</div>
                                    <span class="arrowTop pa"></span>
                                </div>
                                <div class="timeLine month pr">
                                    <div class="timeMark pa">
                                        <span class="time pa">7月</span>
                                        <p class="line pa"></p>
                                    </div>
                                    <div class="workBox clearfix">
                                        <div class="item sy-video fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/744/552/large/konstantinos-skenteridis-nomx-kingkostas2017.jpg?1531186456')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-pic fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/719/865/large/patrik-pulkkinen-blood-moon.jpg?1531065196')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-article fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/760/842/large/konstantinos-skenteridis-fury-kingkostas2017.jpg?1531259334')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-living fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/744/093/large/konstantinos-skenteridis-field-kingkostas2015.jpg?1531182823')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-pic fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/744/900/large/konstantinos-skenteridis-darkjourney-kingkostas2017.jpg?1531188661')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-video fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/724/163/large/konstantinos-skenteridis-canyonruins-kingkostas2018.jpg?1531081848')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-living fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/733/693/large/konstantinos-skenteridis-chap-799-livestream-lakev1.jpg?1531138546')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-article fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/007/682/632/large/bastien-grivet-guardian-bastien-grivet.jpg?1507821303')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                                <div class="timeLine month pr">
                                    <div class="timeMark pa">
                                        <span class="time pa">4月</span>
                                        <p class="line pa"></p>
                                    </div>
                                    <div class="workBox clearfix">
                                        <div class="item sy-video fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/755/411/large/bastien-grivet-from-the-hill.jpg?1531241188')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-pic fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/695/860/large/greg-rutkowski-remorseful-cleric-1500.jpg?1530903204')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-article fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/383/181/large/daniel-jimenez-villalba-the-night-king-detail.jpg?1529325769')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-living fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/000/403/306/large/daniel-jimenez-villalba-basilica.jpg?1421091479')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                                <div class="timeLine year pr">
                                    <div class="timeMark pa">2017年</div>
                                    <p class="line pa"></p>
                                </div>
                                <div class="timeLine month pr">
                                    <div class="timeMark pa">
                                        <span class="time pa">6月</span>
                                        <p class="line pa"></p>
                                    </div>
                                    <div class="workBox clearfix">
                                        <div class="item sy-pic fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/771/387/large/bastien-grivet-the-door.jpg?1531320918')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-video fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/726/901/large/paperblue-net-lake-tree.jpg?1531096588')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-article fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/892/024/large/paperblue-net-ship-typhoon.jpg?1531955038')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-living fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/889/809/large/maena-paillet-snow04.jpg?1531945342')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-living fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/748/224/large/mina-lee-final-edit01-large-size.jpg?1531212103')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-video fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/719/274/large/borisut-chamnan-spirit-1.jpg?1531062725')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-article fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/846/835/large/anthony-avon-sunny-island-small.jpg?1531747144')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-living fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/842/147/large/oleksiy-golovchenko-overpaint-04.jpg?1531720370')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-pic fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/785/138/large/even-amundsen-sweptlands-2.jpg?1531390947')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-article fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/852/421/large/lee-b-maru-160814.jpg?1531765496')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                                <div class="timeLine year pr">
                                    <div class="timeMark pa">2016年</div>
                                    <p class="line pa"></p>
                                </div>
                                <div class="timeLine month pr">
                                    <div class="timeMark pa">
                                        <span class="time pa">9月</span>
                                        <p class="line pa"></p>
                                    </div>
                                    <div class="workBox clearfix">
                                        <div class="item sy-pic fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/861/279/large/dani-torres-cisne-0-5x.jpg?1531810747')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-video fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/858/600/large/pop-amp-anne-80s-.jpg?1531795176')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-article fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/009/537/563/smaller_square/yang-tian-pansen.jpg?1519569817')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-living fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/860/947/large/dani-torres-owl-lo.jpg?1531808872')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-article fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/859/009/large/weijung-lee-18-0712-02.jpg?1531797837')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                                <div class="timeLine year pr">
                                    <div class="timeMark pa">2015年</div>
                                    <p class="line pa"></p>
                                </div>
                                <div class="timeLine month pr">
                                    <div class="timeMark pa">
                                        <span class="time pa">12月</span>
                                        <p class="line pa"></p>
                                    </div>
                                    <div class="workBox clearfix">
                                        <div class="item sy-pic fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/009/544/439/smaller_square/baatr-kotinov-.jpg?1519595974')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-video fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/723/344/large/rostislav-prokop-le-mans-301.jpg?1531077999')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                        <div class="item sy-article fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/videos/images/009/689/172/20180306101750/smaller_square/marine-sisnaki-687041275-640.jpg?1520353070')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                                <div class="timeLine month pr">
                                    <div class="timeMark pa">
                                        <span class="time pa">8月</span>
                                        <p class="line pa"></p>
                                    </div>
                                    <div class="workBox clearfix">
                                        <div class="item sy-pic fl">
                                            <a class="pic db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/7lAOvgftYM8yYLQuEZI7IxzEQ4iHOUBD/B2DMMdAj4Q.jpg')">
                                                <span class="icon pa"><i></i></span>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--缺省-->
                            <div class="emptyInfo tac dn">
                                <div class="icon"></div>
                                <p class="tip">暂时没有创作历程，赶快去新建一个作品吧~<a href="javascript:void(0);">前往创作</a></p>
                            </div>
                            <!--loading-->
                            <div class="loading tac dn">
                                <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--动态-->
            <div class="SY-dynamic wrap clearfix dn">
                <div class="leftNav fl">
                    <!--loading-->
                    <div class="loading tac dn">
                        <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                    </div>
                    <div class="subscriptItem br5">
                        <h2 class="title">订阅项目</h2>
                        <div class="tagsBox">
                            <a href="javascript:void(0);" class="tag dib free">免费</a>
                            <a href="javascript:void(0);" class="tag dib">tag1</a>
                            <a href="javascript:void(0);" class="tag dib active">黑豹教程</a>
                            <a href="javascript:void(0);" class="tag dib">这是一个订阅项目</a>
                        </div>
                        <!--缺省提示-->
                        <div class="emptyInfo tac dn">
                            <div class="icon"></div>
                            <!--作者视角-->
                            <p class="tips">还未上传作品集哦，赶快去<a href="javascript:void(0);">发布</a>吧~</p>
                            <!--访客视角-->
                            <p class="tips">暂无相关内容哦~</p>
                        </div>
                    </div>
                    <div class="albumItem br5">
                        <div class="clearfix">
                            <h2 class="title fl">合集项目</h2>
                            <a class="db transition tac fr buildNewBtn" href="BuildNewAlbum.html"><i class="fa fa-plus"></i>新建</a>
                        </div>
                        <div class="tagsBox">
                            <a href="javascript:void(0);" class="tag dib">合集项目</a>
                            <a href="javascript:void(0);" class="tag dib">tag1</a>
                            <a href="javascript:void(0);" class="tag dib">黑豹教程</a>
                            <a href="javascript:void(0);" class="tag dib">这是一个合集项目</a>
                        </div>
                        <div class="controlAlbum clearfix">
                            <a class="db transition tac fr controlBtn" href="MoreAlbum.html">管理合集</a>
                        </div>
                        <!--缺省提示-->
                        <div class="emptyInfo tac dn">
                            <div class="icon"></div>
                            <!--作者视角-->
                            <p class="tips">还未上传作品集哦，赶快去<a href="javascript:void(0);">发布</a>吧~</p>
                            <!--访客视角-->
                            <p class="tips">暂无相关内容哦~</p>
                        </div>
                    </div>
                    <div class="tagsItem br5">
                        <h2 class="title">标签</h2>
                        <div class="tagsBox">
                            <a href="javascript:void(0);" class="tag dib">标签一</a>
                            <a href="javascript:void(0);" class="tag dib">tag1</a>
                            <a href="javascript:void(0);" class="tag dib">黑豹教程</a>
                            <a href="javascript:void(0);" class="tag dib">Maya</a>
                        </div>
                        <!--缺省提示-->
                        <div class="emptyInfo tac dn">
                            <div class="icon"></div>
                            <!--作者视角-->
                            <p class="tips">还未上传作品集哦，赶快去<a href="javascript:void(0);">发布</a>吧~</p>
                            <!--访客视角-->
                            <p class="tips">暂无相关内容哦~</p>
                        </div>
                    </div>
                </div>
                <div class="statusBox br5 fr">
                    <div class="statusNav clearfix">
                        <h2 class="title fl">TA的动态</h2>
                        <div class="navTab usn fr clearfix">
                            <div class="arrayWays fr">
                                <span class="dib active normal"></span>
                                <span class="dib grid"></span>
                            </div>
                            <ul class="tab fr">
                                <li class="dib active"><span>最新发布</span></li>
                                <li class="dib"><span>最高热度</span></li>
                            </ul>
                        </div>
                    </div>
                    <div class="subNav usn br5">
                        <ul>
                            <li class="item dib active"><a href="javascript:void(0);">全部<span class="num">30</span></a></li>
                            <li class="item dib"><a href="javascript:void(0);">文本<span class="num">8</span></a></li>
                            <li class="item dib"><a href="javascript:void(0);">图片<span class="num">8</span></a></li>
                            <li class="item dib"><a href="javascript:void(0);">文章<span class="num">4</span></a></li>
                            <li class="item dib"><a href="javascript:void(0);">视频<span class="num">6</span></a></li>
                            <li class="item dib"><a href="javascript:void(0);">直播<span class="num">12</span></a></li>
                        </ul>
                    </div>
                    <div class="statusList">
                        <!--列表模式-->
                        <div class="statusContent">
                            <!--图片-->
                            <div class="recommend-item clearfix">
                                <div class="item-pic re-picture br5 fl pr">
                                    <div class="morePic tac br5 pa">
                                        <i class="fa fa-picture-o"></i>
                                        <span class="num">7</span>
                                    </div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/744/552/large/konstantinos-skenteridis-nomx-kingkostas2017.jpg?1531186456')"></a>
                                </div>
                                <div class="item-infos fl">
                                    <div class="item-top clearfix">
                                        <a class="item-title toe fl" href="javascript:void(0)">这是该图片的名称</a>
                                        <p class="item-price fr"><i class="fa fa-unlock"></i><span>￥1--黑豹课程</span></p>
                                    </div>
                                    <p class="item-time">2018-05-15</p>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                    <div class="item-msg clearfix">
                                        <p class="item-tags fl">
                                            <i class="fa fa-tag"></i>
                                            <span class="tag">tag1</span>
                                            <span class="tag">tag2</span>
                                            <span class="tag">tag3</span>
                                        </p>
                                        <div class="item-society fr pr">
                                            <p class="dib scan"><i class="icon"></i><span class="num">340</span></p>
                                            <a href="javascript:void(0);" class="dib comments"><i class="icon"></i><span class="num">20</span></a>
                                            <a href="javascript:void(0);" class="dib thumbsUp active"><i class="icon"></i><span class="num">40</span></a>
                                            <div class="dib share pr">
                                                <a href="javascript:void(0);"><i class="icon"></i><span class="num">15</span></a>
                                                <div class="shareWays br5 pa">
                                                    <span class="pa"></span>
                                                    <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                        <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                        <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                        <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                        <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                    </div>
                                                </div>
                                            </div>
                                            <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="recommend-item pay clearfix">
                                <div class="item-pic picture br5 fl pr">
                                    <div class="morePic tac br5 pa">
                                        <i class="fa fa-picture-o"></i>
                                        <span class="num">7</span>
                                    </div>
                                    <div class="lockCover tac pa">
                                        <p class="icon"><i class="fa fa-lock"></i></p>
                                        <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                    </div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/760/842/large/konstantinos-skenteridis-fury-kingkostas2017.jpg?1531259334')">
                                        <div class="cover pa transition"></div>
                                    </a>
                                </div>
                                <div class="item-infos fl">
                                    <div class="item-top clearfix">
                                        <a class="item-title toe fl" href="javascript:void(0)">这是该图片的名称</a>
                                        <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                    </div>
                                    <p class="item-time">2018-05-15</p>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                    <div class="item-msg clearfix">
                                        <p class="item-tags fl">
                                            <i class="fa fa-tag"></i>
                                            <span class="tag">tag1</span>
                                            <span class="tag">tag2</span>
                                            <span class="tag">tag3</span>
                                        </p>
                                        <div class="item-society fr pr">
                                            <p class="dib scan"><i class="icon"></i><span class="num">340</span></p>
                                            <a href="javascript:void(0);" class="dib comments"><i class="icon"></i><span class="num">20</span></a>
                                            <a href="javascript:void(0);" class="dib thumbsUp"><i class="icon"></i><span class="num">40</span></a>
                                            <div class="dib share pr">
                                                <a href="javascript:void(0);"><i class="icon"></i><span class="num">15</span></a>
                                                <div class="shareWays br5 pa">
                                                    <span class="pa"></span>
                                                    <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                        <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                        <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                        <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                        <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                    </div>
                                                </div>
                                            </div>
                                            <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--视频-->
                            <div class="recommend-item clearfix">
                                <div class="item-pic re-video br5 fl pr">
                                    <div class="playIcon pa">
                                        <i class="fa fa-play-circle-o"></i>
                                    </div>
                                    <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/744/093/large/konstantinos-skenteridis-field-kingkostas2015.jpg?1531182823')">
                                        <div class="cover transition pa"></div>
                                    </a>
                                </div>
                                <div class="item-infos fl">
                                    <div class="item-top clearfix">
                                        <a class="item-title toe fl" href="javascript:void(0)">这是该视频的名称</a>
                                    </div>
                                    <p class="item-time">2018-05-15</p>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                    <div class="item-msg clearfix">
                                        <p class="item-tags fl">
                                            <i class="fa fa-tag"></i>
                                            <span class="tag">tag1</span>
                                            <span class="tag">tag2</span>
                                            <span class="tag">tag3</span>
                                        </p>
                                        <div class="item-society fr pr">
                                            <p class="dib scan"><i class="icon"></i><span class="num">340</span></p>
                                            <a href="javascript:void(0);" class="dib comments"><i class="icon"></i><span class="num">20</span></a>
                                            <a href="javascript:void(0);" class="dib thumbsUp"><i class="icon"></i><span class="num">40</span></a>
                                            <div class="dib share pr">
                                                <a href="javascript:void(0);"><i class="icon"></i><span class="num">15</span></a>
                                                <div class="shareWays br5 pa">
                                                    <span class="pa"></span>
                                                    <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                        <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                        <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                        <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                        <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                    </div>
                                                </div>
                                            </div>
                                            <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="recommend-item pay clearfix">
                                <div class="item-pic re-video  br5 fl pr">
                                    <div class="lockCover tac pa">
                                        <p class="icon"><i class="fa fa-lock"></i></p>
                                        <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                    </div>
                                    <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/695/860/large/greg-rutkowski-remorseful-cleric-1500.jpg?1530903204')">
                                        <div class="cover transition pa"></div>
                                    </a>
                                </div>
                                <div class="item-infos fl">
                                    <div class="item-top clearfix">
                                        <a class="item-title toe fl" href="javascript:void(0)">这是该视频的名称</a>
                                        <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                    </div>
                                    <p class="item-time">2018-05-15</p>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                    <div class="item-msg clearfix">
                                        <p class="item-tags fl">
                                            <i class="fa fa-tag"></i>
                                            <span class="tag">tag1</span>
                                            <span class="tag">tag2</span>
                                            <span class="tag">tag3</span>
                                        </p>
                                        <div class="item-society fr pr">
                                            <p class="dib scan"><i class="icon"></i><span class="num">340</span></p>
                                            <a href="javascript:void(0);" class="dib comments"><i class="icon"></i><span class="num">20</span></a>
                                            <a href="javascript:void(0);" class="dib thumbsUp"><i class="icon"></i><span class="num">40</span></a>
                                            <div class="dib share pr">
                                                <a href="javascript:void(0);"><i class="icon"></i><span class="num">15</span></a>
                                                <div class="shareWays br5 pa">
                                                    <span class="pa"></span>
                                                    <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                        <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                        <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                        <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                        <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                    </div>
                                                </div>
                                            </div>
                                            <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--直播-->
                            <div class="recommend-item clearfix">
                                <div class="item-pic re-living br5 fl pr">
                                    <div class="livingTip tac br5 pa">
                                        <i class="fa fa-video-camera"></i>
                                    </div>
                                    <div class="living pa tac">
                                        <div class="liveSoon dn">
                                            <p class="text">即将直播</p>
                                            <p class="text timeTip">距离直播开始还剩<br><span class="day">30</span>天<span class="hour">23</span>小时<span class="minute">30</span>分</p>
                                        </div>
                                        <div class="liveNow d n">
                                            <p class="livingIcon"></p>
                                            <p class="text">正在直播</p>
                                        </div>
                                        <div class="livefinish dn">
                                            <p class="text">直播已结束</p>
                                        </div>
                                    </div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/000/403/306/large/daniel-jimenez-villalba-basilica.jpg?1421091479')">
                                        <div class="cover transition pa"></div>
                                    </a>
                                </div>
                                <div class="item-infos fl">
                                    <div class="item-top clearfix">
                                        <a class="item-title toe fl" href="javascript:void(0)">这是该直播的名称</a>
                                        <p class="item-price fr"><i class="fa fa-unlock"></i><span>￥1--黑豹课程</span></p>
                                    </div>
                                    <p class="item-time">2018-05-15</p>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                    <div class="item-msg clearfix">
                                        <p class="item-tags fl">
                                            <i class="fa fa-tag"></i>
                                            <span class="tag">tag1</span>
                                            <span class="tag">tag2</span>
                                            <span class="tag">tag3</span>
                                        </p>
                                        <div class="item-society fr pr">
                                            <p class="dib scan"><i class="icon"></i><span class="num">340</span></p>
                                            <a href="javascript:void(0);" class="dib comments"><i class="icon"></i><span class="num">20</span></a>
                                            <a href="javascript:void(0);" class="dib thumbsUp"><i class="icon"></i><span class="num">40</span></a>
                                            <div class="dib share pr">
                                                <a href="javascript:void(0);"><i class="icon"></i><span class="num">15</span></a>
                                                <div class="shareWays br5 pa">
                                                    <span class="pa"></span>
                                                    <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                        <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                        <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                        <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                        <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                    </div>
                                                </div>
                                            </div>
                                            <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="recommend-item pay clearfix">
                                <div class="item-pic re-living br5 fl pr">
                                    <div class="livingTip tac br5 pa">
                                        <i class="fa fa-video-camera"></i>
                                    </div>
                                    <div class="lockCover tac pa">
                                        <p class="icon"><i class="fa fa-lock"></i></p>
                                        <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                    </div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/719/865/large/patrik-pulkkinen-blood-moon.jpg?1531065196')">
                                        <div class="cover transition pa"></div>
                                    </a>
                                </div>
                                <div class="item-infos fl">
                                    <div class="item-top clearfix">
                                        <a class="item-title toe fl" href="javascript:void(0)">这是该直播的名称</a>
                                        <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                    </div>
                                    <p class="item-time">2018-05-15</p>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                    <div class="item-msg clearfix">
                                        <p class="item-tags fl">
                                            <i class="fa fa-tag"></i>
                                            <span class="tag">tag1</span>
                                            <span class="tag">tag2</span>
                                            <span class="tag">tag3</span>
                                        </p>
                                        <div class="item-society fr pr">
                                            <p class="dib scan"><i class="icon"></i><span class="num">340</span></p>
                                            <a href="javascript:void(0);" class="dib comments"><i class="icon"></i><span class="num">20</span></a>
                                            <a href="javascript:void(0);" class="dib thumbsUp"><i class="icon"></i><span class="num">40</span></a>
                                            <div class="dib share pr">
                                                <a href="javascript:void(0);"><i class="icon"></i><span class="num">15</span></a>
                                                <div class="shareWays br5 pa">
                                                    <span class="pa"></span>
                                                    <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                        <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                        <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                        <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                        <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                    </div>
                                                </div>
                                            </div>
                                            <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--文章-->
                            <div class="recommend-item clearfix">
                                <div class="item-pic re-article br5 fl pr">
                                    <div class="articleIcon br50 tac pa">
                                        <i class="fa fa-file-text"></i>
                                    </div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/755/411/large/bastien-grivet-from-the-hill.jpg?1531241188')"></a>
                                </div>
                                <div class="item-infos fl">
                                    <div class="item-top clearfix">
                                        <a class="item-title toe fl" href="javascript:void(0)">这是该文章的名称</a>
                                        <p class="item-price fr"><i class="fa fa-unlock"></i><span>￥1--黑豹课程</span></p>
                                    </div>
                                    <p class="item-time">2018-05-15</p>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                    <div class="item-msg clearfix">
                                        <p class="item-tags fl">
                                            <i class="fa fa-tag"></i>
                                            <span class="tag">tag1</span>
                                            <span class="tag">tag2</span>
                                            <span class="tag">tag3</span>
                                        </p>
                                        <div class="item-society fr pr">
                                            <p class="dib scan"><i class="icon"></i><span class="num">340</span></p>
                                            <a href="javascript:void(0);" class="dib comments"><i class="icon"></i><span class="num">20</span></a>
                                            <a href="javascript:void(0);" class="dib thumbsUp"><i class="icon"></i><span class="num">40</span></a>
                                            <div class="dib share pr">
                                                <a href="javascript:void(0);"><i class="icon"></i><span class="num">15</span></a>
                                                <div class="shareWays br5 pa">
                                                    <span class="pa"></span>
                                                    <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                        <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                        <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                        <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                        <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                    </div>
                                                </div>
                                            </div>
                                            <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="recommend-item pay clearfix">
                                <div class="item-pic re-article br5 fl pr">
                                    <div class="articleIcon br50 tac pa">
                                        <i class="fa fa-file-text"></i>
                                    </div>
                                    <div class="lockCover tac pa">
                                        <p class="icon"><i class="fa fa-lock"></i></p>
                                        <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                    </div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/861/279/large/dani-torres-cisne-0-5x.jpg?1531810747')">
                                        <div class="cover transition pa"></div>
                                    </a>
                                </div>
                                <div class="item-infos fl">
                                    <div class="item-top clearfix">
                                        <a class="item-title toe fl" href="javascript:void(0)">这是该文章的名称</a>
                                        <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                    </div>
                                    <p class="item-time">2018-05-15</p>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                    <div class="item-msg clearfix">
                                        <p class="item-tags fl">
                                            <i class="fa fa-tag"></i>
                                            <span class="tag">tag1</span>
                                            <span class="tag">tag2</span>
                                            <span class="tag">tag3</span>
                                        </p>
                                        <div class="item-society fr pr">
                                            <p class="dib scan"><i class="icon"></i><span class="num">340</span></p>
                                            <a href="javascript:void(0);" class="dib comments"><i class="icon"></i><span class="num">20</span></a>
                                            <a href="javascript:void(0);" class="dib thumbsUp"><i class="icon"></i><span class="num">40</span></a>
                                            <div class="dib share pr">
                                                <a href="javascript:void(0);"><i class="icon"></i><span class="num">15</span></a>
                                                <div class="shareWays br5 pa">
                                                    <span class="pa"></span>
                                                    <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                        <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                        <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                        <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                        <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                    </div>
                                                </div>
                                            </div>
                                            <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--文本-->
                            <div class="recommend-item clearfix">
                                <div class="item-infos re-text fl pr">
                                    <div class="putTop pa">
                                        <i class="fa fa-bookmark"></i>
                                        <span class="pa">顶</span>
                                    </div>
                                    <div class="item-top clearfix">
                                        <span class="item-time fr">2018-05-15</span>
                                    </div>
                                    <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                    <div class="item-msg clearfix">
                                        <p class="item-tags fl">
                                            <i class="fa fa-tag"></i>
                                            <span class="tag">tag1</span>
                                            <span class="tag">tag2</span>
                                            <span class="tag">tag3</span>
                                        </p>
                                        <div class="item-society fr pr">
                                            <p class="dib scan"><i class="icon"></i><span class="num">340</span></p>
                                            <a href="javascript:void(0);" class="dib comments"><i class="icon"></i><span class="num">20</span></a>
                                            <a href="javascript:void(0);" class="dib thumbsUp"><i class="icon"></i><span class="num">40</span></a>
                                            <div class="dib share pr">
                                                <a href="javascript:void(0);"><i class="icon"></i><span class="num">15</span></a>
                                                <div class="shareWays br5 pa">
                                                    <span class="pa"></span>
                                                    <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                        <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                        <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                        <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                        <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                    </div>
                                                </div>
                                            </div>
                                            <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="recommend-item pay clearfix">
                                <div class="item-pic re-text br5 fl pr">
                                    <div class="articleIcon br50 tac pa">
                                        <i class="fa fa-file-text"></i>
                                    </div>
                                    <div class="lockCover tac pa">
                                        <p class="icon"><i class="fa fa-lock"></i></p>
                                        <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                    </div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('img/personalCenter/defaultPic.jpg')">
                                        <div class="cover transition pa"></div>
                                    </a>
                                </div>
                                <div class="item-infos fl">
                                    <div class="item-top clearfix">
                                        <a class="item-text toe fl" href="javascript:void(0)">该文本的缩略内容该文本的缩略内容该文本的缩略内容</a>
                                        <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                    </div>
                                    <p class="item-time">2018-05-15</p>
                                    <p class="item-desc"></p>
                                    <div class="item-msg clearfix">
                                        <p class="item-tags fl">
                                            <i class="fa fa-tag"></i>
                                            <span class="tag">tag1</span>
                                            <span class="tag">tag2</span>
                                            <span class="tag">tag3</span>
                                        </p>
                                        <div class="item-society fr pr">
                                            <p class="dib scan"><i class="icon"></i><span class="num">340</span></p>
                                            <a href="javascript:void(0);" class="dib comments"><i class="icon"></i><span class="num">20</span></a>
                                            <a href="javascript:void(0);" class="dib thumbsUp"><i class="icon"></i><span class="num">40</span></a>
                                            <div class="dib share pr">
                                                <a href="javascript:void(0);"><i class="icon"></i><span class="num">15</span></a>
                                                <div class="shareWays br5 pa">
                                                    <span class="pa"></span>
                                                    <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                        <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                        <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                        <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                        <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                    </div>
                                                </div>
                                            </div>
                                            <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--分页-->
                            <div class="page tac">
                                <ul class="pageList pr clearfix">
                                    <li class="text disable"><a href="javascript:void(0);">首页</a></li>
                                    <li class="text disable"><a href="javascript:void(0);">上一页</a></li>
                                    <li class="pageActive"><a href="javascript:void(0);">1</a></li>
                                    <li><a href="javascript:void(0);">2</a></li>
                                    <li><a href="javascript:void(0);">3</a></li>
                                    <li><a href="javascript:void(0);">...</a></li>
                                    <li class="text"><a href="javascript:void(0);">下一页</a></li>
                                    <li class="text"><a href="javascript:void(0);">尾页</a></li>
                                </ul>
                            </div>
                        </div>
                        <!--九宫格模式-->
                        <div class="statusGrid clearfix dn">
                            <!--图片-->
                            <div class="recommend-item fl br5 border1">
                                <div class="item-pic re-picture pr">
                                    <div class="picIcon br5 pa"><i class="fa fa-picture-o"></i><span class="num">7</span></div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/744/552/large/konstantinos-skenteridis-nomx-kingkostas2017.jpg?1531186456')"></a>
                                </div>
                                <div class="item-msg">
                                    <a href="javascript:void(0);" class="item-name toe">这是该图片的名称</a>
                                    <div class="item-detail pr clearfix">
                                        <p class="item-time fl">2018-05-15</p>
                                        <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                        <div class="unormal pa br5 dn">
                                            <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                            <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                            <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                            <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                        </div>
                                    </div>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <div class="item-society">
                                        <p class="item-seen dib"><i class="icon"></i><span class="num">340</span></p>
                                        <p class="item-comment dib"><i class="icon"></i><span class="num">20</span></p>
                                        <p class="item-thumbUp dib"><i class="icon"></i><span class="num">40</span></p>
                                    </div>
                                </div>
                            </div>
                            <div class="recommend-item fl pay br5 border1">
                                <div class="item-pic re-picture pr">
                                    <div class="picIcon br5 pa"><i class="fa fa-picture-o"></i><span class="num">7</span></div>
                                    <div class="lockCover tac pa">
                                        <p class="icon"><i class="fa fa-lock"></i></p>
                                        <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                    </div>
                                    <a class="db" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/760/842/large/konstantinos-skenteridis-fury-kingkostas2017.jpg?1531259334')">
                                        <div class="coverPic transition pa"></div>
                                    </a>
                                </div>
                                <div class="item-msg">
                                    <a href="javascript:void(0);" class="item-name toe">这是该图片的名称</a>
                                    <div class="item-detail pr clearfix">
                                        <p class="item-time fl">2018-05-15</p>
                                        <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                        <div class="unormal pa br5 dn">
                                            <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                            <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                            <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                            <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                        </div>
                                    </div>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <div class="item-society">
                                        <p class="item-seen dib"><i class="icon"></i><span class="num">340</span></p>
                                        <p class="item-comment dib"><i class="icon"></i><span class="num">20</span></p>
                                        <p class="item-thumbUp dib"><i class="icon"></i><span class="num">40</span></p>
                                    </div>
                                </div>
                            </div>
                            <!--视频-->
                            <div class="recommend-item fl br5 border1">
                                <div class="item-pic re-video pr">
                                    <div class="playIcon pa">
                                        <i class="fa fa-play-circle-o"></i>
                                    </div>
                                    <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/744/093/large/konstantinos-skenteridis-field-kingkostas2015.jpg?1531182823')">
                                        <div class="coverPic transition pa"></div>
                                    </a>
                                </div>
                                <div class="item-msg">
                                    <a href="javascript:void(0);" class="item-name toe">这是该图片的名称</a>
                                    <div class="item-detail pr clearfix">
                                        <p class="item-time fl">2018-05-15</p>
                                        <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                        <div class="unormal pa br5 dn">
                                            <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                            <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                            <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                            <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                        </div>
                                    </div>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <div class="item-society">
                                        <p class="item-seen dib"><i class="icon"></i><span class="num">340</span></p>
                                        <p class="item-comment dib"><i class="icon"></i><span class="num">20</span></p>
                                        <p class="item-thumbUp dib"><i class="icon"></i><span class="num">40</span></p>
                                    </div>
                                </div>
                            </div>
                            <div class="recommend-item fl pay br5 border1">
                                <div class="item-pic re-video pr">
                                    <div class="lockCover tac pa">
                                        <p class="icon"><i class="fa fa-lock"></i></p>
                                        <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                    </div>
                                    <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/011/695/860/large/greg-rutkowski-remorseful-cleric-1500.jpg?1530903204')">
                                        <div class="coverPic transition pa"></div>
                                    </a>
                                </div>
                                <div class="item-msg">
                                    <a href="javascript:void(0);" class="item-name toe">这是该图片的名称</a>
                                    <div class="item-detail pr clearfix">
                                        <p class="item-time fl">2018-05-15</p>
                                        <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                        <div class="unormal pa br5 dn">
                                            <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                            <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                            <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                            <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                        </div>
                                    </div>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <div class="item-society">
                                        <p class="item-seen dib"><i class="icon"></i><span class="num">340</span></p>
                                        <p class="item-comment dib"><i class="icon"></i><span class="num">20</span></p>
                                        <p class="item-thumbUp dib"><i class="icon"></i><span class="num">40</span></p>
                                    </div>
                                </div>
                            </div>
                            <!--直播-->
                            <div class="recommend-item fl br5 border1">
                                <div class="item-pic re-living pr">
                                    <div class="livingTip tac br5 pa">
                                        <i class="fa fa-video-camera"></i>
                                    </div>
                                    <div class="living pa tac">
                                        <div class="liveSoon dn">
                                            <p class="text">即将直播</p>
                                            <p class="text timeTip">距离直播开始还剩<br><span class="day">30</span>天<span class="hour">23</span>小时<span class="minute">30</span>分</p>
                                        </div>
                                        <div class="liveNow d n">
                                            <p class="livingIcon"></p>
                                            <p class="text">正在直播</p>
                                        </div>
                                        <div class="livefinish dn">
                                            <p class="text">直播已结束</p>
                                        </div>
                                    </div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/000/403/306/large/daniel-jimenez-villalba-basilica.jpg?1421091479')">
                                        <div class="coverPic transition pa"></div>
                                    </a>
                                </div>
                                <div class="item-msg">
                                    <a href="javascript:void(0);" class="item-name toe">这是该图片的名称</a>
                                    <div class="item-detail pr clearfix">
                                        <p class="item-time fl">2018-05-15</p>
                                        <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                        <div class="unormal pa br5 dn">
                                            <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                            <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                            <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                            <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                        </div>
                                    </div>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <div class="item-society">
                                        <p class="item-seen dib"><i class="icon"></i><span class="num">340</span></p>
                                        <p class="item-comment dib"><i class="icon"></i><span class="num">20</span></p>
                                        <p class="item-thumbUp dib"><i class="icon"></i><span class="num">40</span></p>
                                    </div>
                                </div>
                            </div>
                            <div class="recommend-item fl pay br5 border1">
                                <div class="item-pic re-living pr">
                                    <div class="livingTip tac br5 pa">
                                        <i class="fa fa-video-camera"></i>
                                    </div>
                                    <div class="lockCover tac pa">
                                        <p class="icon"><i class="fa fa-lock"></i></p>
                                        <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                    </div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/719/865/large/patrik-pulkkinen-blood-moon.jpg?1531065196')">
                                        <div class="coverPic transition pa"></div>
                                    </a>
                                </div>
                                <div class="item-msg">
                                    <a href="javascript:void(0);" class="item-name toe">这是该图片的名称</a>
                                    <div class="item-detail pr clearfix">
                                        <p class="item-time fl">2018-05-15</p>
                                        <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                        <div class="unormal pa br5 dn">
                                            <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                            <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                            <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                            <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                        </div>
                                    </div>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <div class="item-society">
                                        <p class="item-seen dib"><i class="icon"></i><span class="num">340</span></p>
                                        <p class="item-comment dib"><i class="icon"></i><span class="num">20</span></p>
                                        <p class="item-thumbUp dib"><i class="icon"></i><span class="num">40</span></p>
                                    </div>
                                </div>
                            </div>
                            <!--文章-->
                            <div class="recommend-item fl br5 border1">
                                <div class="item-pic re-article pr">
                                    <div class="articleIcon br50 tac pa">
                                        <i class="fa fa-file-text"></i>
                                    </div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/755/411/large/bastien-grivet-from-the-hill.jpg?1531241188')"></a>
                                </div>
                                <div class="item-msg">
                                    <a href="javascript:void(0);" class="item-name toe">这是该图片的名称</a>
                                    <div class="item-detail pr clearfix">
                                        <p class="item-time fl">2018-05-15</p>
                                        <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                        <div class="unormal pa br5 dn">
                                            <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                            <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                            <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                            <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                        </div>
                                    </div>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <div class="item-society">
                                        <p class="item-seen dib"><i class="icon"></i><span class="num">340</span></p>
                                        <p class="item-comment dib"><i class="icon"></i><span class="num">20</span></p>
                                        <p class="item-thumbUp dib"><i class="icon"></i><span class="num">40</span></p>
                                    </div>
                                </div>
                            </div>
                            <div class="recommend-item fl pay br5 border1">
                                <div class="item-pic re-article pr">
                                    <div class="articleIcon br50 tac pa">
                                        <i class="fa fa-file-text"></i>
                                    </div>
                                    <div class="lockCover tac pa">
                                        <p class="icon"><i class="fa fa-lock"></i></p>
                                        <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                    </div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/011/861/279/large/dani-torres-cisne-0-5x.jpg?1531810747')">
                                        <div class="coverPic transition pa"></div>
                                    </a>
                                </div>
                                <div class="item-msg">
                                    <a href="javascript:void(0);" class="item-name toe">这是该图片的名称</a>
                                    <div class="item-detail pr clearfix">
                                        <p class="item-time fl">2018-05-15</p>
                                        <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                        <div class="unormal pa br5 dn">
                                            <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                            <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                            <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                            <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                        </div>
                                    </div>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <div class="item-society">
                                        <p class="item-seen dib"><i class="icon"></i><span class="num">340</span></p>
                                        <p class="item-comment dib"><i class="icon"></i><span class="num">20</span></p>
                                        <p class="item-thumbUp dib"><i class="icon"></i><span class="num">40</span></p>
                                    </div>
                                </div>
                            </div>
                            <!--文本-->
                            <div class="recommend-item fl br5 border1">
                                <div class="item-pic re-txt pr">
                                    <div class="text pa">这是该文本的缩略内容这是该文本的缩略内容这是该文本的缩略内容这是该文本的缩略内容这是该文本的缩略内容这是该文本的缩略内容</div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('img/personalCenter/txtBg.png')"></a>
                                </div>
                                <div class="item-msg">
                                    <a href="javascript:void(0);" class="item-name toe">&nbsp;</a>
                                    <div class="item-detail pr clearfix">
                                        <p class="item-time fl">2018-05-15</p>
                                        <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                        <div class="unormal pa br5 dn">
                                            <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                            <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                            <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                            <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                        </div>
                                    </div>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <div class="item-society">
                                        <p class="item-seen dib"><i class="icon"></i><span class="num">340</span></p>
                                        <p class="item-comment dib"><i class="icon"></i><span class="num">20</span></p>
                                        <p class="item-thumbUp dib"><i class="icon"></i><span class="num">40</span></p>
                                    </div>
                                </div>
                            </div>
                            <div class="recommend-item fl pay br5 border1">
                                <div class="item-pic re-txt pr">
                                    <div class="lockCover tac pa">
                                        <p class="icon"><i class="fa fa-lock"></i></p>
                                        <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                    </div>
                                    <a class="db pr" href="javascript:void(0);" style="background-image:url('img/personalCenter/txtBg.png')"></a>
                                </div>
                                <div class="item-msg">
                                    <a href="javascript:void(0);" class="item-name toe">&nbsp;</a>
                                    <div class="item-detail pr clearfix">
                                        <p class="item-time fl">2018-05-15</p>
                                        <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                        <div class="unormal pa br5 dn">
                                            <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                            <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                            <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                            <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                        </div>
                                    </div>
                                    <p class="item-classify">数字2D-2D动画</p>
                                    <div class="item-society">
                                        <p class="item-seen dib"><i class="icon"></i><span class="num">340</span></p>
                                        <p class="item-comment dib"><i class="icon"></i><span class="num">20</span></p>
                                        <p class="item-thumbUp dib"><i class="icon"></i><span class="num">40</span></p>
                                    </div>
                                </div>
                            </div>
                            <!--分页-->
                            <div class="page tac">
                                <ul class="pageList pr clearfix">
                                    <li class="text disable"><a href="javascript:void(0);">首页</a></li>
                                    <li class="text disable"><a href="javascript:void(0);">上一页</a></li>
                                    <li class="pageActive"><a href="javascript:void(0);">1</a></li>
                                    <li><a href="javascript:void(0);">2</a></li>
                                    <li><a href="javascript:void(0);">3</a></li>
                                    <li><a href="javascript:void(0);">...</a></li>
                                    <li class="text"><a href="javascript:void(0);">下一页</a></li>
                                    <li class="text"><a href="javascript:void(0);">尾页</a></li>
                                </ul>
                            </div>
                        </div>
                        <!--loading-->
                        <div class="loading tac dn">
                            <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                        </div>
                        <!--缺省提示-->
                        <div class="emptyInfo tac dn">
                            <div class="icon"></div>
                            <!--作者视角-->
                            <p class="tips">分享优质内容，可以获得更多的订阅者，同时获得收益</p>
                            <a class="uploadBtn transition db br5" href="javascript:void(0);">上传作品</a>
                            <!--访客视角-->
                            <p class="tips dn">该作者并未创建任何内容哦~</p>
                        </div>
                    </div>
                </div>
            </div>
            <!--收藏-->
            <div class="SY-collect dn"></div>
            <!--留言板-->
            <div class="SY-leaveWord wrap dn">
                <!--发表留言-->
                <div class="user-leaveWord">
                    <h2 class="title">发表留言</h2>
                    <div class="user-writeBox">
                        <textarea class="br5 border1 db" placeholder="快来说点什么吧..." onfocus="this.placeholder=''" onblur="this.placeholder='快来说点什么吧...'"></textarea>
                        <div class="tar user-publish">
                            <p class="dib wordsLimit warning"><span>1001</span>/1000</p>
                            <a class="dib br5 transition tac publish-btn" href="javascript:void(0);">发表</a>
                        </div>
                    </div>
                </div>
                <!--全部留言-->
                <div class="user-wordBox">
                    <div class="user-tab clearfix">
                        <h2 class="title fl">全部留言<span class="num">(100)</span></h2>
                        <ul class="navTab usn fr">
                            <li class="dib active"><span>默认时间</span></li>
                            <li class="dib"><span>最高热度</span></li>
                        </ul>
                    </div>
                    <div class="user-wordList">
                        <!--加载中-->
                        <div class="loading tac dn">
                            <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                        </div>
                        <!--缺省提示-->
                        <div class="emptyInfo tac dn">
                            <div class="icon"></div>
                            <p class="tips">还没有人给你留言哦~</p>
                        </div>
                        <div class="wordList">
                            <div class="word-item clearfix">
                                <div class="user-avatar br50 fl">
                                    <a href="javascript:void(0);"><img src="http://img.yxs.shenyecg.com/Image/h8VE1fiHlWerj0FrkEUSYlLa4m3sppLi/KECAnarYPG.jpg" alt=""></a>
                                    <a href="javascript:void(0);"><span class="mark db approveGold"></span></a>
                                </div>
                                <div class="user-operation fl">
                                    <div class="user-msg pr">
                                        <div class="user-detail">
                                            <a href="javascript:void(0);" class="user-nickName">路人甲</a>
                                        </div>
                                        <div class="user-control pa">
                                            <a class="pa icon" href="javascript:void(0);"><i class="fa fa-caret-down transition"></i></a>
                                            <ul class="pa selectBox">
                                                <li><a class="db transition delete" href="javascript:void(0);">删除</a></li>
                                            </ul>
                                        </div>
                                    </div>
                                    <div class="user-word">这是该用户的留言...</div>
                                    <div class="user-infos clearfix">
                                        <div class="time fl"><span>2018-05-10</span><span>16:40:00</span></div>
                                        <div class="infos tar fr">
                                            <a href="javascript:void(0);" class="dib leaveWords"><i></i></a>
                                            <a href="javascript:void(0);" class="dib thumbsUp"><i></i><span class="num">640</span></a>
                                        </div>
                                    </div>
                                    <div class="mainComment pr">
                                        <span class="pa triangle"></span>
                                        <input class="br5 user-write" type="text" placeholder="回复&nbsp;路人甲" onfocus="this.placeholder=''" onblur="this.placeholder='回复&nbsp;路人甲'">
                                        <div class="btns">
                                            <a class="dib br5 transition tac confirm" href="javascript:void(0);">确认</a>
                                            <a class="dib br5 transition tac cancel" href="javascript:void(0);">取消</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="word-item clearfix">
                                <div class="user-avatar br50 fl">
                                    <a href="javascript:void(0);"><img src="http://img.yxs.shenyecg.com/Image/h8VE1fiHlWerj0FrkEUSYlLa4m3sppLi/KECAnarYPG.jpg" alt=""></a>
                                    <a href="javascript:void(0);"><span class="mark db approveBlue"></span></a>
                                </div>
                                <div class="user-operation fl">
                                    <div class="user-msg pr">
                                        <div class="user-detail">
                                            <a href="javascript:void(0);" class="user-nickName">路人甲</a>
                                        </div>
                                        <div class="user-control pa">
                                            <a class="pa icon" href="javascript:void(0);"><i class="fa fa-caret-down transition"></i></a>
                                            <ul class="pa selectBox">
                                                <li><a class="db transition delete" href="javascript:void(0);">删除</a></li>
                                            </ul>
                                        </div>
                                    </div>
                                    <div class="user-word">这是该用户的留言...</div>
                                    <div class="user-infos clearfix">
                                        <div class="time fl"><span>2018-05-10</span><span>16:40:00</span></div>
                                        <div class="infos tar fr">
                                            <a href="javascript:void(0);" class="dib leaveWords"><i></i></a>
                                            <a href="javascript:void(0);" class="dib thumbsUp active"><i></i><span class="num">640</span></a>
                                        </div>
                                    </div>
                                    <div class="mainComment dn pr">
                                        <span class="pa triangle"></span>
                                        <input class="br5 user-write" type="text" placeholder="回复&nbsp;路人甲" onfocus="this.placeholder=''" onblur="this.placeholder='回复&nbsp;路人甲'">
                                        <div class="btns">
                                            <a class="dib br5 transition tac confirm" href="javascript:void(0);">确认</a>
                                            <a class="dib br5 transition tac cancel" href="javascript:void(0);">取消</a>
                                        </div>
                                    </div>
                                    <div class="user-comments pr">
                                        <div class="comment-box">
                                            <div class="comment-item clearfix">
                                                <div class="avatar fl br50">
                                                    <a href="javascript:void(0);"><img src="http://img.yxs.shenyecg.com/Image/CDg8sf6s33evuVtkHpzHEcXJbaOzq41y/2W74tQNZPB.jpg" alt=""></a>
                                                    <a href="javascript:void(0);"><span class="mark db approveBlue"></span></a>
                                                </div>
                                                <div class="main-item fl">
                                                    <div class="main-words">
                                                        <p class="dib users"><span class="nickName">路人乙</span><i>回复</i><span class="nickName">路人甲：</span></p>
                                                        <span class="text">So say goodbye and hit the road.Pack it up and disappear.You better have some place to go.</span>
                                                    </div>
                                                    <div class="infos">
                                                        <p class="dib time"><span>2018-05-11</span><span>13:52:52</span></p>
                                                        <p class="dib operation">
                                                            <a class="reply" href="javascript:void(0);">回复</a>
                                                            <a class="delete" href="javascript:void(0);">删除</a>
                                                        </p>
                                                    </div>
                                                    <div class="writeComments pr">
                                                        <span class="pa triangle"></span>
                                                        <input class="br5 user-write" type="text" placeholder="回复&nbsp;路人甲" onfocus="this.placeholder=''" onblur="this.placeholder='回复&nbsp;路人甲'">
                                                        <div class="btns">
                                                            <a class="dib br5 transition tac confirm" href="javascript:void(0);">确认</a>
                                                            <a class="dib br5 transition tac cancel" href="javascript:void(0);">取消</a>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="comment-item clearfix">
                                                <div class="avatar fl br50">
                                                    <a href="javascript:void(0);"><img src="http://img.yxs.shenyecg.com/Image/CDg8sf6s33evuVtkHpzHEcXJbaOzq41y/2W74tQNZPB.jpg" alt=""></a>
                                                    <a href="javascript:void(0);"><span class="mark db approveGold"></span></a>
                                                </div>
                                                <div class="main-item fl">
                                                    <div class="main-words">
                                                        <p class="dib users"><span class="nickName">路人乙</span><i>回复</i><span class="nickName">路人甲：</span></p>
                                                        <span class="text">So say goodbye and hit the road.Pack it up and disappear.You better have some place to go.'Cause you can't come back around here.Good goodbye.Don't you come back no more.Live from the rhythm it's.Something wild venomous.Enemies trying to read me</span>
                                                    </div>
                                                    <div class="infos">
                                                        <p class="dib time"><span>2018-05-11</span><span>13:52:52</span></p>
                                                        <p class="dib operation">
                                                            <a class="reply" href="javascript:void(0);">回复</a>
                                                            <a class="delete" href="javascript:void(0);">删除</a>
                                                        </p>
                                                    </div>
                                                    <div class="writeComments pr">
                                                        <span class="pa triangle"></span>
                                                        <input class="br5 user-write" type="text" placeholder="回复&nbsp;路人甲" onfocus="this.placeholder=''" onblur="this.placeholder='回复&nbsp;路人甲'">
                                                        <div class="btns">
                                                            <a class="dib br5 transition tac confirm" href="javascript:void(0);">确认</a>
                                                            <a class="dib br5 transition tac cancel" href="javascript:void(0);">取消</a>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="comment-page tar dn">
                                            <a class="backIndexBtn" href="javascript:void(0);">回到首页</a>
                                            <a class="nextBtn" href="javascript:void(0);">下一页</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="page tac dn">
                        <ul class="pageList pr clearfix">
                            <li class="text disable"><a href="javascript:void(0);">首页</a></li>
                            <li class="text disable"><a href="javascript:void(0);">上一页</a></li>
                            <li class="pageActive"><a href="javascript:void(0);">1</a></li>
                            <li><a href="javascript:void(0);">2</a></li>
                            <li><a href="javascript:void(0);">3</a></li>
                            <li><a href="javascript:void(0);">...</a></li>
                            <li class="text"><a href="javascript:void(0);">下一页</a></li>
                            <li class="text"><a href="javascript:void(0);">尾页</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--换肤模板-->
    <div class="renewStyle-template usn pf">
        <div class="opacityBg"></div>
        <div class="renewStyle-innerWrap">
            <div class="custormHeader pr">
                <a class="closeBtn pa" href="javascript:void(0);"></a>
                <ul class="menuTab clearfix">
                    <li class="item fl">
                        <a href="javascript:void(0);">设置背景</a>
                    </li>
                </ul>
            </div>
            <div class="custormMenu">
                <div class="subMenu tac">
                    <ul class="clearfix">
                        <li class="item skin fl active">
                            <a href="javascript:void(0);">皮肤</a>
                        </li>
                        <li class="item bg fl">
                            <a href="javascript:void(0);">自定义背景</a>
                        </li>
                    </ul>
                </div>
                <div class="templateBox">
                    <div class="templateList custormSkin tac">
                        <div class="itemList white dib active">
                            <a class="db" href="javascript:void(0);">
                                <span class="itemImg db"></span>
                                <span class="checkPic pa"></span>
                            </a>
                            <p>白色</p>
                        </div>
                        <div class="itemList black dib">
                            <a class="db" href="javascript:void(0);">
                                <span class="itemImg db"></span>
                                <span class="checkPic pa"></span>
                            </a>
                            <p>黑色</p>
                        </div>
                    </div>
                    <div class="templateList custormBg currActive clearfix dn">
                        <!--上传封面-->
                        <div class="uploadTempPic fl tac">
                            <div class="uploadPicBox">
                                <!--未上传-->
                                <div class="unUploadTemp dn">
                                    <a class="db pr" href="javascript:void(0);">
                                        <span class="dib icon"></span>
                                        <span class="db txt">上传图片</span>
                                        <input type="file" class="pa">
                                    </a>
                                </div>
                                <!--已上传-->
                                <div class="uploadedTemp pr">
                                    <div class="bgPic" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/012/176/032/smaller_square/red-hong-20180727.jpg?1533449100')"></div>
                                    <a class="deleteBtn db pa" href="javascript:void(0);"><span class="db icon"></span></a>
                                    <a class="reUploadBtn pa" href="javascript:void(0);">
                                        <span class="dib icon"></span>
                                        <span class="db">重新上传</span>
                                        <input type="file" class="pa">
                                    </a>
                                </div>
                                <!--loading-->
                                <div class="loading tac dn">
                                    <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                                </div>
                            </div>
                            <div class="uploadText">
                                <p class="tip">(5M以内的jpg,gif,png格式)</p>
                                <P class="singleCheck">
                                    <label>
                                        <span class="dib icon"></span>
                                        <span class="txt">隐藏封面图</span>
                                    </label>
                                </P>
                            </div>
                        </div>
                        <!--展示方式-->
                        <div class="showMode fl">
                            <p class="modeTitle">展示方式（可复选）：</p>
                            <div class="showWays clearfix">
                                <div class="showItem fl">
                                    <a class="repeatBg db pr" href="javascript:void(0);">
                                        <span class="itemImg db"></span>
                                        <span class="checkPic pa"></span>
                                    </a>
                                    <p class="tips-txt">平铺</p>
                                </div>
                                <div class="showItem fl">
                                    <a class="lockBg db pr" href="javascript:void(0);">
                                        <span class="itemImg db"></span>
                                        <span class="checkPic pa"></span>
                                    </a>
                                    <p class="tips-txt">锁定</p>
                                </div>
                            </div>
                            <div class="custormBgColor">
                                <P class="singleCheck dib">
                                    <label>
                                        <span class="dib icon"></span>
                                        <span class="txt">背景色</span>
                                    </label>
                                </P>
                                <div class="customWidget dib pr">
                                    <div class="selectedShow tac dib">#ff4500</div>
                                    <div class="colorSelector dib">
                                        <div class="selectedColor" style="background-color: #ff4500;"></div>
                                    </div>
                                    <div class="colorPickerHolder pa" style="display: none;background: orangered;">

                                    </div>
                                </div>
                            </div>
                        </div>
                        <!--对齐方式-->
                        <div class="alignMode fl">
                            <p class="modeTitle">对齐方式：</p>
                            <div class="showWays clearfix">
                                <div class="showItem fl">
                                    <a class="alignCenter db pr" href="javascript:void(0);">
                                        <span class="itemImg db"></span>
                                        <span class="checkPic pa"></span>
                                    </a>
                                    <p class="tips-txt">居中对齐</p>
                                </div>
                                <div class="showItem fl">
                                    <a class="alignLeft db pr" href="javascript:void(0);">
                                        <span class="itemImg db"></span>
                                        <span class="checkPic pa"></span>
                                    </a>
                                    <p class="tips-txt">居左对齐</p>
                                </div>
                                <div class="showItem fl">
                                    <a class="alignRight db pr" href="javascript:void(0);">
                                        <span class="itemImg db"></span>
                                        <span class="checkPic pa"></span>
                                    </a>
                                    <p class="tips-txt">居右对齐</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="custormFooter">
                <div class="buttons tac">
                    <a class="confirmBtn transition dib" href="javascript:void(0);">确认</a>
                    <a class="cancelBtn transition dib" href="javascript:void(0);">取消</a>
                </div>
            </div>
        </div>
    </div>
</div>
<!--主内容 结束-->
<!--页脚 开始-->
<div class="SY-footer">
    <div class="SY-foot clearfix">
        <div class="aboutUs fl">
            <div class="logoBox">
                <img src="img/icons/bottomLogo.png" alt="">
                <p class="dib slogin">深夜研习社</p>
                <span class="line dib"></span>
                <p class="dib text">知识应该受到尊重</p>
            </div>
            <div class="connectUs">
                <p class="text dib">联系我们:<span class="phoneNumer dib">027-62438159</span></p>
                <a href="javascript:void(0);" class="tencent linkIcon"></a>
            </div>
        </div>
        <div class="msgDetail fr clearfix">
            <ul class="iconList fr">
                <li class="pr">
                    <span class="wechat linkIcon"></span>
                    <div class="weChatCode tac pa">
                        <i class="icon-arrow-down pa"></i>
                        <p class="scan">扫描二维码</p>
                        <p class="text">关注微信公众号</p>
                        <img src="img/icons/WeChatCode.jpg" alt="">
                    </div>
                </li>
                <li><a href="javascript:void(0);" class="sina linkIcon"></a></li>
            </ul>
            <dl class="fr">
                <dt><a href="HelpCenter.html">关于我们</a></dt>
            </dl>
            <dl class="fr">
                <dt><a href="HelpCenter.html">服务条款</a></dt>
            </dl>
            <dl class="fr">
                <dt><a href="HelpCenter.html">版权申明</a></dt>
            </dl>
            <dl class="fr">
                <dt><a href="HelpCenter.html">常见问题</a></dt>
            </dl>
            <p class="recordNumber"><a href="javascript:void(0);">Copyright&copy; www.shenyecg.com 2017 | 鄂ICP备16021987号-1</a></p>
        </div>
    </div>
</div>
<!--页脚 结束-->
<script src="js/jquery.min.js"></script>
<script src="js/search.js"></script>
<script>
    $(function () {
        //公告显示 & 隐藏
        var icon = $(".SY-userBannerBox .SY-userInfo .SY-notice .icon");
            //点击显示 & 隐藏
        icon.click(function () {
            noticeFold(icon);
        });
            //延迟12s 隐藏
        setTimeout(function () {
           noticeFold(icon);
        },12000);

        function noticeFold (obj) {
            obj.toggleClass("fold");
            obj.siblings(".SY-announcement").slideToggle(300);
        }

        //导航切换
        $(".SY-content .SY-navTab .item").click(function () {
            var navIndex = $(this).index();
            $(this).addClass("active").siblings().removeClass("active");
            $(".SY-mainBox > div").eq(navIndex).removeClass("dn").siblings().addClass("dn");
        });

        //主页导航切换
        $(".SY-mainPage .SY-subNav .SY-pageNav .item").click(function () {
            var pageIndex = $(this).index();
            $(this).addClass("active").siblings().removeClass("active");
            $(".SY-mainPage .SY-mainPageBox > div").eq(pageIndex).removeClass("dn").siblings().addClass("dn");
        });

        //目标进度切换
        //左按钮
        var i = 0;
        var size = $(".targetProgress .target").length;
        $(".targetBox .prev").click(function () {
            if(i == 0){
                return
            }
            if(i > 0){
                $(this).siblings().removeClass("disable");
            }
            if(i == 1) {
                $(this).addClass("disable");
            }
            i --;
            move();
        });
        //右按钮
        $(".targetBox .next").click(function () {
            if(i == (size - 1)){
                return
            }
            if(i < (size - 1)){
                $(this).siblings().removeClass("disable");
            }
            if(i == (size - 2)){
                $(this).addClass("disable");
            }
            i ++;
            move();
        });
        //移动事件
        function move() {
            $(".targetProgress .target").stop().animate({ left: (-i) * 280,"transition":"all .3s" });
        };

        //关注按钮点击事件
        $(".SY-mainContent .SY-userBannerBox .SY-userInfo .followBtn").click(function () {
            $(this).toggleClass("active");
            $(this).hasClass("active") ? $(this).html("已关注") : $(this).html("关注");
        });

        //动态statusBox 导航切换
        //九宫格切换
        $(".SY-dynamic .statusBox .arrayWays span").click(function () {
            var array_index = $(this).index();
            $(this).addClass("active").siblings().removeClass("active");
            $(".SY-dynamic .statusBox .statusList > div").eq(array_index).removeClass("dn").siblings().addClass("dn");
        });

        //最新发布 & 最高热度 切换
        $(".SY-dynamic .statusBox .tab li").click(function () {
            $(this).addClass("active").siblings().removeClass("active");
        });

        //置顶 & 编辑 & 删除 选项显示与隐藏
        $(".SY-dynamic .recommend-item .ellipsis").click(function () {
            $(this).siblings(".unormal").slideToggle();
        });

        //视频、直播、图片、文章 -- 置顶 & 取消置顶
        $(".SY-dynamic .recommend-item .stick").click(function () {
            var putTop = $("<div class='putTop pa'>" +
                "    <i class='fa fa-bookmark'></i>" +
                "    <span class='pa'>顶</span>" +
                "</div>");
            if ($(this).hasClass("active")) {
                $(this).removeClass("active");
                $(this).find("span").html("置顶");
                $(this).parents(".recommend-item").find(".putTop").remove();
            }else{
                $(this).addClass("active");
                $(this).find("span").html("取消置顶");
                $(this).parents(".recommend-item").find(".item-pic").append(putTop);
            }

        });

        //热度 & 时间 -- 切换
        $(".SY-leaveWord .user-tab .navTab li>span").click(function () {
            $(this).parent().addClass("active").siblings().removeClass("active");
        });

        //评论回复框显示隐藏
        $(".SY-leaveWord .word-item .leaveWords").click(function () {
            $(this).parents(".user-infos").siblings(".mainComment").slideToggle();
        });

        //回复留言
        $(".SY-leaveWord .comment-item .reply").click(function () {
            $(this).parents(".infos").siblings(".writeComments").slideToggle();
        });

        //留言列表是否显示分页
        var item_num = $(".SY-leaveWord .SY-mainBox .user-wordList .word-item").length;
        if(item_num >= 20) {
            $(".SY-leaveWord .page").removeClass("dn");
        }else{
            $(".SY-leaveWord .page").addClass("dn");
        }

        //留言评论是否显示分页
        var comment_num = $(".SY-leaveWord .user-wordList .comment-box .comment-item").length;
        if(comment_num >= 10) {
            $(".SY-leaveWord .user-wordList .comment-page").removeClass("dn");
        }else{
            $(".SY-leaveWord .user-wordList .comment-page").addClass("dn");
        }

        //删除按钮点击事件
        $(".SY-leaveWord .user-operation .selectBox .delete").click(function () {
            $(this).parents(".word-item").remove();
            var item_num = $(".SY-leaveWord .user-wordList .word-item").length;
            if(item_num < 20){
                $(".SY-leaveWord .page").addClass("dn");
            }
            if(item_num <= 0) {
                $(".SY-leaveWord .user-wordList").find(".emptyInfo").removeClass("dn");
            }
        });

    })
</script>
<script>
    //换肤
    $(function () {
        //换肤模板显示 & 隐藏
        $(".renewStyle ").click(function () {
            $(".renewStyle-template").animate({"bottom":"0px","left":"0px","transition":"bottom 0.1s ease 0s"});
        });
        $(".renewStyle-template .custormHeader .closeBtn").click(function () {
            $(this).parents(".renewStyle-template").animate({"bottom":"-308px","left":"0px","transition":"bottom 0.1s ease 0s"});
        });

        //皮肤 & 自定义背景切换
        $(".renewStyle-template .subMenu .item").click(function () {
           var this_index = $(this).index();
           $(this).addClass("active").siblings().removeClass("active");
           $(".renewStyle-template .templateBox .templateList").eq(this_index).removeClass("dn").siblings().addClass("dn");
        });

        //换皮肤
        $(".renewStyle-template .custormMenu .custormSkin .itemList").click(function () {
            var color_index = $(this).index();
            $(this).addClass("active").siblings().removeClass("active");
        });

        //自定义背景
        $(".renewStyle-template .custormBg .showMode .showWays .showItem").click(function () {
            $(this).toggleClass("active");
        });
        $(".renewStyle-template .custormBg .alignMode .showWays .showItem").click(function () {
            $(this).addClass("active").siblings().removeClass("active");
        });

        //单选框 -> 隐藏封面图
        $(".renewStyle-template .custormBg .uploadTempPic .singleCheck label").click(function () {
            if($(this).find(".icon").hasClass("active")) {
                $(this).find(".icon").removeClass("active");
                $(".SY-userBannerBox").css("background-image","url('http://img.yxs.shenyecg.com/Image/sjeoJe8XzPKxDqtxfsoK2Z3MLqpmrPpI/37JNxRbBbD.jpg')");
            }else{
                $(this).find(".icon").addClass("active");
                $(".SY-userBannerBox").css("background-image","url('')");
            }
        });

        //单选框 -> 自定义背景色
        $(".renewStyle-template .custormBg .showMode .singleCheck label").click(function () {
            if($(this).find(".icon").hasClass("active")) {
                $(this).find(".icon").removeClass("active");
                $("html").css("background","#eef0f6");
                $("body").css("background","#eef0f6");
            }else{
                $(this).find(".icon").addClass("active");
                $("html").css("background","#ff4500");
                $("body").css("background","#ff4500");
            }
        })

    })
</script>
<script>
    window._bd_share_config = {
        common : {
            bdText : '自定义分享内容',
            bdDesc : '自定义分享摘要',
            bdUrl : '自定义分享url地址',
            bdPic : '自定义分享图片'
        },
        share : [{
            "bdSize" : 32
        }]
    };
    with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?cdnversion='+~(-new Date()/36e5)];
</script>
</body>
</html>